{% extends 'base.html' %}
{% load static %}
{% block title %}
    <title>天天生鲜-商品列表</title>
    <link rel="stylesheet" href="{% static "css/pager.css" %}">
    <script src="{% static "js/jquery-1.12.4.min.js" %}"></script>
    <script src="{% static "js/pager.js" %}"></script>
    <script src="{% static "js/template.js" %}"></script>
{% endblock title %}

{% block body %}
	<div class="search_bar clearfix">
		<a href="/" class="logo fl"><img src="{% static "images/logo.png" %}"></a>
		<div class="search_con fl">
			<input type="text" class="input_text fl" name="" placeholder="搜索商品">
			<input type="button" class="input_btn fr" name="" value="搜索">
		</div>
		<div class="guest_cart fr">
			<a href="#" class="cart_name fl">我的购物车</a>
			<div class="goods_count fl">1</div>
		</div>
	</div>

	<div class="navbar_con">
		<div class="navbar clearfix">
			<div class="subnav_con fl">
				<h1>全部商品分类</h1>	
				<span></span>			
				<ul class="subnav">
					<li><a href="#" class="fruit">新鲜水果</a></li>
					<li><a href="#" class="seafood">海鲜水产</a></li>
					<li><a href="#" class="meet">猪牛羊肉</a></li>
					<li><a href="#" class="egg">禽类蛋品</a></li>
					<li><a href="#" class="vegetables">新鲜蔬菜</a></li>
					<li><a href="#" class="ice">速冻食品</a></li>
				</ul>
			</div>
			<ul class="navlist fl">
				<li><a href="/">首页</a></li>
				<li class="interval">|</li>
				<li><a href="">手机生鲜</a></li>
				<li class="interval">|</li>
				<li><a href="">抽奖</a></li>
			</ul>
		</div>
	</div>

	<div class="breadcrumb">
		<a href="#">全部分类</a>
		<span>></span>
		<a href="#">新鲜水果</a>
	</div>

	<div class="main_wrap clearfix">
		<div class="l_wrap fl clearfix">
			<div class="new_goods">
				<h3>新品推荐</h3>
				<ul>
					<li>
						<a href="#"><img src="images/goods/goods001.jpg"></a>
						<h4><a href="#">进口柠檬</a></h4>
						<div class="prize">￥3.90</div>
					</li>
					<li>
						<a href="#"><img src="images/goods/goods002.jpg"></a>
						<h4><a href="#">玫瑰香葡萄</a></h4>
						<div class="prize">￥16.80</div>
					</li>
				</ul>
			</div>
		</div>

		<div class="r_wrap fr clearfix">
			<div class="sort_bar">
				<a href="#" class="active">默认</a>
				<a href="#">价格</a>
				<a href="#">人气</a>
			</div>

			<ul class="goods_type_list clearfix">
                {% for foo in list %}
                <li>
					<a href="/user/detail/{{ foo.id }}"><img src="/static/media/{{ foo.gpic }}"></a>
					<h4><a href="/user/detail/{{ foo.id }}">{{ foo.gname }}</a></h4>
					<div class="operate">
						<span class="prize">￥{{ foo.gprise }}</span>
						<span class="unit">{{ foo.gprise }}/{{ foo.gunit }}</span>
						<a href="#" class="add_goods" title="加入购物车"></a>
					</div>
				</li>
                {% endfor %}
			</ul>
			<div class="page_container">
                <ul class="pagination1" id="page">
                </ul>
                <div class="pageJump">
                    <span>跳转到</span>
                    <input type="text" />
                    <span>页</span>
                    <input type="button" class="button" value="确定">
                </div>
            </div>
		</div>
	</div>

{% endblock body %}
{% block footer %}
    <script>
    	$(function(){
            Page({
                num: {{ pagecount }}, //页码数
                startnum: {{ num }}, //指定页码
                elem: $('#page'), //指定的元素
                callback: function(n) { //回调函数
                    window.location.href = '/goods/list/1/'+n+'/';
                }
            });
{#            getData()#}

    	})

{#    function getData(n){#}
{#        var _n = n?n:1;#}
{#        $.get('/goods/list/1/'+_n+'/',function(data){#}
{#            var list = JSON.parse(data.list);#}
{#            var _html = '';#}
{#            for (var i = 0; i < list.length; i++) {#}
{#                _html+="<li>"#}
{#				_html+="<a href="/user/detail/"+this.fields.id+"><img src="/static/media/"+this.fields.gpic+"></a>"#}
{#				_html+="<h4><a href="/user/detail/{{ this.fields.id }}">{{ this.fields.gname }}</a></h4>"#}
{#				_html+="<div class="operate">"#}
{#				_html+="<span class="prize">￥{{ this.fields.gprise }}</span>"#}
{#				_html+="<span class="unit">{{ this.fields.gprise }}/{{ this.fields.gunit }}</span>"#}
{#				_html+="<a href="#" class="add_goods" title="加入购物车"></a>"#}
{#				_html+="</div>"#}
{#				_html+="</li>"#}
{#            }#}
{##}
{#            $('.goods_type_list').html(_html)#}
{#        })#}
{#    }#}
    </script>
{% endblock footer %}